<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link rel="stylesheet" type="text/css" href="../css/account/consume/index.css"/>
		<link rel="stylesheet" href="../font-awesome/css/font-awesome.css" />
	
	</head>
	<body>
		<header>
			<a href="account.html"><span class="fa fa-angle-left"></span></a>
			<div class="pay" id="pay">
				消费详情
			    <span class="fa fa-caret-down" class="x_l"></span>
			</div>
			
		</header>
		<nav>
			2016年 本月
		</nav>
	<main>
		<div class="li">
			<img src="../img/images/img2_03.png" alt="" />
			<div>
					<p>
						<span>天天消消乐</span>
						<span>短信量充值</span>
					</p>
					<p>2016/7/6 14:24</p>
			</div>
			<div>
				-1条
			</div>
		</div>
		
	</main>
	<main>
		<div class="li">
			<img src="../img/images/img2_06.png" alt="" />
			<div>
					<p>
						<span style="color: #27d7f6;border-color: #27d7f6;">天天消消乐</span>
						<span>短信量充值</span>
					</p>
					<p>2016/7/6 14:24</p>
			</div>
			<div style="color: red;">
				-1条
			</div>
		</div>
		
	</main>	
	<main>
		<div class="li">
			<img src="../img/images/img2_06.png" alt="" />
			<div>
					<p>
						<span>天天消消乐</span>
						<span>短信充值</span>
					</p>
					<p>2016/7/6 14:24</p>
			</div>
			<div style="color: red;">
				-1条
			</div>
		</div>
		
	</main>
	<main>
		<div class="li">
			<img src="../img/images/img2_03.png" alt="" />
			<div>
					<p>
						<span style="color: #f67af9;border-color: #f67af9;">天天消消乐</span>
						<span>闪注量充值</span>
					</p>
					<p>2016/7/6 14:24</p>
			</div>
			<div>
				-1条
			</div>
		</div>
		
	</main>
		
	<nav style="height: 1.525rem;padding-top: 0.27rem;">
			2016年 7月4日
		</nav>
	<main>
		<div class="li">
			<img src="../img/images/img2_06.png" alt="" />
			<div>
					<p>
						<span>天天消消乐</span>
						<span>闪注量充值</span>
					</p>
					<p>2016/7/6 14:24</p>
			</div>
			<div>
				-1条
			</div>
		</div>
		
	</main>
	
	
	<main>
		<div class="li">
			<img src="../img/images/img2_03.png" alt="" />
			<div>
					<p>
						<span style="color: #27d7f6;border-color: #27d7f6;">天天消消乐</span>
						<span>短信量充值</span>
					</p>
					<p>2016/7/6 14:24</p>
			</div>
			<div style="color: red;">
				-1条
			</div>
		</div>
		
	</main>	
	<main>
		<div class="li">
			<img src="../img/images/img2_03.png" alt="" />
			<div>
					<p>
						<span>天天消消乐</span>
						<span>闪注量充值</span>
					</p>
					<p>2016/7/6 14:24</p>
			</div>
			<div style="color: red;">
				-1条
			</div>
		</div>
		
	</main>
	<main>
		<div class="li">
			<img src="../img/images/img2_06.png" alt="" />
			<div>
					<p>
						<span style="color: #f67af9;border-color: #f67af9;">天天消消乐</span>
						<span>闪注量充值</span>
					</p>
					<p>2016/7/6 14:24</p>
			</div>
			<div>
				-1条
			</div>
		</div>
	<div id="yi_ying">
				<div class="pay1" id="downlist">
					<div class="qb">全部</div>
					<div class="yy">
						<img src="../img/images/yy_03.png" alt="" />
					</div>
					<div class="san clearfix">
						<div class="qb tt">天天消消乐</div>
						<div class="qb da">大话西游</div>
						<div class="qb da">王者荣耀</div>
					</div>
				</div>
			</div>
		<script src="../js/jquery-1.7.2.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
		(function(win,doc){
		//浏览器缩放时
			win.onresize=function(){
				change();	
			};
			change();
			function change(){
				var oFs=doc.documentElement.clientWidth/(320/20);
		
				//设置根目录字体大小
				doc.documentElement.style.fontSize=oFs+'px';	
			}	
		})(window,document);
		
		document.getElementsByClassName("rand")[0].onclick = function(){
			setInterval(daojishi,1000);
			var i = 60;
			function daojishi(){
				if(i>0){
					document.getElementsByClassName("rand")[0].innerText = "剩余"+i--+"秒";
				}
			}
	}
		
	</script>
<script type="text/javascript">
//	$(function(){
//		$("#pay").click(function(){
//			
//			  	$("#yi_ying").toggle();
//			  	$("#downlist").slideToggle()
//			  })
//		
//		$("#yi_ying").click(function(){
//			
//			  	$("#yi_ying").fadeOut();
//			  	
//			  	
//			  })
//	})
		$(function(){
		$("#pay").click(function(){
			
			  	$("#yi_ying").toggle();
			  	$("#downlist").slideDown()
			  })
		
		$("#yi_ying").click(function(){
				$("#downlist").slideUp()
			  	$("#yi_ying").fadeOut();
			  	
			  	
			  	
			  })
	})

		
</script>		
	</body>
</html>
